import { saveKeywordy } from '@/services/api/api-datahub-keyword';
import { getPretreatmentRecordAreaCascaders } from '@/services/api/api-datahub-record';
import { ProFormCascader, ProFormSelect } from '@ant-design/pro-components';
import ProForm, { DrawerForm, ProFormText } from '@ant-design/pro-form';
import { Button, Cascader, message } from 'antd';
import React, { useState } from 'react';

interface AddKeywordProps {
  onRefurbish: () => void;
  organization: { key: string; title: string };
}
const AddKeyword: React.FC<AddKeywordProps> = ({ onRefurbish, organization }) => {
  const [areaList, setAreaList] = useState<DatahubRecordData.ChannelList[]>([]);

  const getAreaList = async () => {
    const res = await getPretreatmentRecordAreaCascaders();
    setAreaList(res.data);
  };

  return (
    <DrawerForm
      title="新增"
      drawerProps={{
        destroyOnClose: true,
        width: 700,
      }}
      trigger={<Button type="primary">新增</Button>}
      onOpenChange={(open) => {
        if (open) {
          getAreaList();
        }
      }}
      onFinish={async (values) => {
        let areaIdss = new Array();

        if (values.areaIds != undefined) {
          values.areaIds.forEach((areaId: any[]) => {
            let areaIds = new Array();
            areaId.forEach((item: string) => {
              if (item.indexOf('=')) {
                areaIds.push(item.substring(item.lastIndexOf('=') + 1, item.length));
              } else {
                areaIds.push(item);
              }
            });

            areaIdss.push(areaIds);
          });
        }

        const response = await saveKeywordy({
          ...values,
          areaIds: areaIdss,
        });
        if (response.code === 0) {
          message.success('提交成功');
          onRefurbish();
        }
        return true;
      }}
    >
      <ProForm.Group>
        <ProFormText
          width="xl"
          name="name"
          label="名称"
          rules={[{ required: true, message: '请输入名称' }]}
        />
      </ProForm.Group>
      <ProForm.Group>
        <ProFormSelect
          name="types"
          label="类型"
          width="xl"
          placeholder="请选择关键词类型"
          fieldProps={{
            mode: 'multiple',
          }}
          rules={[{ required: true, message: '请选择关键词类型' }]}
          options={[
            {
              label: '人名',
              value: 1,
            },
            {
              label: '地名',
              value: 2,
            },
            {
              label: '机构',
              value: 3,
            },
            {
              label: '其他',
              value: 4,
            },
          ]}
        />
      </ProForm.Group>
      <ProForm.Group>
        <ProFormCascader
          label="区域"
          name="areaIds"
          width="xl"
          placeholder="选择区域"
          extra={
            <div>
              <span>不选默认重庆，所有区县都会接收到该关键字命中数据。</span>
              <br />
              <span>建议所选区域越详细越好。</span>
            </div>
          }
          fieldProps={{
            options: areaList,
            multiple: true,
            removeIcon: true,
            allowClear: true,
            showSearch: true,
            maxTagCount: 'responsive',
            showCheckedStrategy: Cascader.SHOW_PARENT,
          }}
        />
      </ProForm.Group>
    </DrawerForm>
  );
};
export default AddKeyword;
